<%@ include file="../common/top.jsp"%>


<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>


    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="css/fixmyaccount.css">
    <script src="https://kit.fontawesome.com/5a681e6fdb.js" crossorigin="anonymous"></script>
    <title>我的账户</title>


<div class="w">
    <div class="userinfo">
        <div class="userinfo-title">My Account</div>
        <form action="change" class="user-form" method="POST">
        <div class="userinfo-info">
            <div class="userinfo-item">
                <label class="userinfo-item-icon">
                    <i class="fa-solid fa-user"></i>
                </label>
                <label class="userinfo-item-tag">
                    Name:
                </label>

                <input type="text" class="user-form-input" name="username" id="username" value=${sessionScope.loginAccount.username} autocomplete="off">

            </div>
            <div class="userinfo-item">
                <label class="userinfo-item-icon">
                    <i class="fa-solid fa-signature"></i>
                </label>
                <label class="userinfo-item-tag">
                    First Name:
                </label>
                <input type="text" class="user-form-input" name="firstname" id="firstname" value=${sessionScope.loginAccount.firstName} autocomplete="off">
            </div>
            <div class="userinfo-item">
                <label class="userinfo-item-icon">
                    <i class="fa-solid fa-signature"></i>
                </label>
                <label class="userinfo-item-tag">
                    Last Name:
                </label>
                <input type="text" class="user-form-input" name="lastname" id="lastname" value=${sessionScope.loginAccount.lastName} autocomplete="off">
            </div>
            <div class="userinfo-item">
                <label class="userinfo-item-icon">
                    <i class="fa-solid fa-signature"></i>
                </label>
                <label class="userinfo-item-tag">
                    Old Password:
                </label>
                <input type="text" class="user-form-input" name="oldpassword" id="oldpassword"  autocomplete="off">
            </div>

            <div class="userinfo-item">
                <label class="userinfo-item-icon">
                    <i class="fa-solid fa-signature"></i>
                </label>
                <label class="userinfo-item-tag">
                    New Password:
                </label>
                <input type="text" class="user-form-input" name="newpassword" id="newpassword"  autocomplete="off">
            </div>

            <div class="userinfo-item">
                <label class="userinfo-item-icon">
                    <i class="fa-solid fa-envelope"></i>
                </label>
                <label class="userinfo-item-tag">
                    Email:
                </label>
                <input type="text" class="user-form-input" name="email" id="email" value=${sessionScope.loginAccount.email} autocomplete="off">
            </div>
            <div class="userinfo-item">
                <label class="userinfo-item-icon">
                    <i class="fa-solid fa-earth-americas"></i>
                </label>
                <label class="userinfo-item-tag">
                    Country:
                </label>
                <label class="userinfo-item-var">
                    <input type="text" class="user-form-input" name="country" id="country" value=${sessionScope.loginAccount.country} autocomplete="off">
                </label>
            </div>
            <div class="userinfo-item">
                <label class="userinfo-item-icon">
                    <i class="fa-solid fa-map-location-dot"></i>
                </label>
                <label class="userinfo-item-tag">
                    State:
                </label>
                <input type="text" class="user-form-input" name="state" id="state" value=${sessionScope.loginAccount.state} autocomplete="off">
            </div>
            <div class="userinfo-item">
                <label class="userinfo-item-icon">
                    <i class="fa-solid fa-city"></i>
                </label>
                <label class="userinfo-item-tag">
                    City:
                </label>
                <input type="text" class="user-form-input" name="city" id="city" value=${sessionScope.loginAccount.city} autocomplete="off">
            </div>
            <div class="userinfo-item">
                <label class="userinfo-item-icon">
                    <i class="fa-solid fa-location-dot"></i>
                </label>
                <label class="userinfo-item-tag">
                    Address1:
                </label>
                <input type="text" class="user-form-input" name="address1" id="address1" value=${sessionScope.loginAccount.address1} autocomplete="off">
            </div>
            <div class="userinfo-item">
                <label class="userinfo-item-icon">
                    <i class="fa-solid fa-location-dot"></i>
                </label>
                <label class="userinfo-item-tag">
                    Address2:
                </label>

                    <input type="text" class="user-form-input" name="address2" id="address2" value=${sessionScope.loginAccount.address2} autocomplete="off">

            </div>
            <div class="userinfo-item">
                <label class="userinfo-item-icon">
                    <i class="fa-solid fa-envelopes-bulk"></i>
                </label>
                <label class="userinfo-item-tag">
                    Zip:
                </label>
                <input type="text" class="user-form-input" name="zip" id="zip" value=${sessionScope.loginAccount.zip} >
            </div>
            <div class="userinfo-item">
                <label class="userinfo-item-icon">
                    <i class="fa-solid fa-phone"></i>
                </label>
                <label class="userinfo-item-tag">
                    Phone:
                </label>
                <input type="text" class="user-form-input" name="phone" id="phone" value=${sessionScope.loginAccount.phone} >
            </div>

            <div class="userinfo-item">
                <label for="bannerOption">是否要展示推荐：</label>
                <select name="bannerOption" id="bannerOption">
                    <option value="1">是</option>
                    <option value="0">否</option>
                </select>
            </div>

            <div class="userinfo-item">
                <label for="favouriteCategoryId">最喜爱的动物：</label>
                <select name="favouriteCategoryId" id="favouriteCategoryId">
                    <option value="CATS">CATS</option>
                    <option value="DOGS">DOGS</option>
                    <option value="BIRDS">BIRDS</option>
                    <option value="FISH">FISH</option>
                    <option value="REPTILES">REPTILES</option>
                </select>
            </div>

            <div class="userinfo-item">
                <label for="listOption">是否要展示购物车：</label>
                <select name="listOption" id="listOption">
                    <option value="1">是</option>
                    <option value="0">否</option>
                </select>
            </div>

            <div class="userinfo-item-submit">
                <input type="submit" value="submit" class="userinfo-submit">
            </div>

        </div>
        </form>
    </div>
</div>




<%@ include file="../common/bottom.jsp"%>
